.nav-left
  width 120px
  height 100%
  background #2A2935
  box-shadow inset -15px 0 15px -15px #222
  float left
  position relative
  -webkit-user-select none
  -moz-user-select none
  -ms-user-select none
  -o-user-select none
  user-select none
  .avatar
    width 100px
    height 100px
    margin 55px auto 15px
    border-radius 50%
    box-shadow 0 0 0px 4px white, 0 0 4px 4px #eee
    background-repeat no-repeat
    background-size 100px 100px
    display block
    &:hover
      -webkit-animation rubberBand 1s
      animation rubberBand 1s
  .author
    text-align center
    height 27px
    color white
  .more-menus
    display: none
  .icon
    text-align center
    margin 0 auto 5px
    a
      color white
      line-height 19px
      &:hover
        color #309e85
      &.rss:before
        content "\ea9b"
      &.github:before
        content "\eab0"
      &.twitter:before
        content "\ea96"
      &.weibo:before
        content "\ea9a"
      &.linkedin:before
        content "\eac9"
      &.instagram:before
        content "\ea92"
      &.email:before
        content "\e945"
      &.facebook:before
        content "\ea91"
      &.reddit:before
        content "\eac6"
      &.qq:before
        content "\e626"
      &.neteasemusic:before
        content "\e607"
      &.kugou:before
        content "\e6ce"

  ul
    margin 0
    padding 0
    font-size 17px
    border-top 1px solid #fff
    list-style none
    overflow-y auto
    &.sub
      transition height .3s, border-top .3s
      border-left: solid 2px red;
      overflow-y hidden
      &.hide
        height 0 !important
        border-top hidden
      li
        line-height 25px
        font-size 14px
        &:last-child
          border-bottom hidden
        &>div
          height 25px
    li
      line-height 40px
      text-align center
      border-bottom 1px solid #fff
      cursor pointer
      &>div
        height 40px
        color rgba(255,255,255,0.7)
        transition color .15s linear,box-shadow .3s cubic-bezier(.77, 0, .175, 1)
        position relative
        &:hover
          color #f7f7f7
          box-shadow inset 6px 0 0 #fff
        &.active
          color #020202
          box-shadow inset 165px 0 0 #fff
          position relative
        &>.fold
          left: 4px
          font-size 0.7em
          position: absolute
          transition transform .3s
          &.unfold
            transform: rotate(90deg)

  .left-bottom
    position absolute
    display table
    border-collapse collapse
    bottom 0px
    width 100%
    font-size 17px
    color rgba(255,255,255,0.7)
    a
      display table-cell
      height 30px
      text-align center
      vertical-align middle
      border-top 1px solid #fff
      width 100%
      line-height 30px
      &.about
        display: inline-block
        &.hasFriend
          border-right 1px solid #fff
          width 49%
      &.friends
        display: inline-block
      &.dynamic-menu
        display block
